/**
 * Created by xin.zhang on 16/8/17.
 */
import React,{Component,PropTypes} from 'react'
import { connect } from 'react-redux'
import AppBarExampleIcon from '../components/AppBarExampleIcon'
import GridListExampleComplex from '../components/GridListExampleComplex'
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import * as actions from '../actions';
import {bindActionCreators} from 'redux';
class Main extends Component{
    render() {
        const { openBar, showLeftBar} = this.props;
        return <div>
            <MuiThemeProvider>
                <AppBarExampleIcon showState={showLeftBar} openBar={(s)=>{openBar(s)}}/>
            </MuiThemeProvider>
            <MuiThemeProvider>
                <GridListExampleComplex/>
            </MuiThemeProvider>
        </div>
    }
}

// Which props do we want to inject, given the global state?
// Note: use https://github.com/faassen/reselect for better performance.
function select(state) {
   //此处是根据已有state的值做处理返回想要的数据格式
    return {
        showLeftBar:state.showLeftBar
    }
}
const mapDispatchToProps=(dispatch)=>{return(
    bindActionCreators(actions,dispatch)
)};

// 包装 component ，注入 dispatch 和 state 到其默认的 connect(select)(App) 中；
export default connect(select,mapDispatchToProps)(Main)